<template>
  <el-card style="width: 100%">
    <el-col :span="24">
      <span>非认证服务号不可开启微信原生会员卡功能支持</span>
      <el-button type="primary" @click="SkipMember(form.MId)">编辑会员卡</el-button>
    </el-col>
    <el-col :span="24">
      <span>微信原生会员卡功能可允许会员将领取到的会员卡同步至微信卡包并使用</span>
    </el-col>
  </el-card>

  <el-card style="width: 100%">
    <p style="font-size: 25px; color: black; font-family: '楷体', serif">
      基本设置
    </p>
    <span>会员卡标题：{{ form.Title }}</span>
  </el-card>

  <el-card style="width: 100%">
    <p style="font-size: 25px; color: black; font-family: '楷体', serif">
      会员卡详情
    </p>
    <el-form :model="form" label-width="auto" style="max-width: 600px">
      <el-form-item label="特权介绍">
        <el-input v-model="form.Useexplain" type="textarea" />
      </el-form-item>
      <el-form-item label="使用须知">
        <el-input v-model="form.Notice" type="textarea" />
      </el-form-item>
    </el-form>
  </el-card>
</template>
<script lang="ts" setup>
// 引入组件
import { ElTable } from "element-plus";
import { reactive, ref, onMounted } from "vue";
//引入路由
import { useRouter, useRoute } from "vue-router";
import axios from "axios";
import { ElMessage, ElMessageBox } from "element-plus";
axios.defaults.baseURL = "http://localhost:5089/api/";

//路由变量
const router = useRouter();

//当前页面路由
const route = useRoute();

const form = reactive({
  MId: 0,
  Brandname: "",
  Title: "",
  Background: "",
  VIPCard: "",
  Validity: "",
  Useexplain: "",
  Notice: "",
  Tenantid: "default",
});

const GetmemberData = () => {
  let mId = Number(route.query.mId);
console.log(mId);
axios.get("MemberCard/GetMemberCardDelital?mId=" + mId).then((res) => {
  console.log(res.data);
  form.MId = res.data.MId;
  form.Brandname = res.data.Brandname;
  form.Title = res.data.Title;
  form.Background = res.data.Background;
  form.VIPCard = res.data.VIPCard;
  form.Validity = res.data.Validity;
  form.Useexplain = res.data.Useexplain;
  form.Notice = res.data.Notice;
  form.Tenantid = res.data.Tenantid;
});
};

const SkipMember = (MId: number) => {
  router.push("MemberEdit?mId=" + MId);
};

onMounted(() => {
  GetmemberData();
});
</script>

<style></style>
